<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>运行中的流程实例</title>
    <!-- 公共CSS,JS文件 -->
    <#include "../common/header.ftl"/>
</head>
<body>
<div class="container-fluid">
    <!-- 左右侧导航 -->
    <div class="row">
        <!-- 右侧导航 -->
        <div class="col-xs-12">
            <div class="panel">
                <div class="panel-heading">
                    <ol class="breadcrumb" style="margin-bottom: 2px;">
                        <li>首页</li>
                        <li>工作流管理</li>
                        <li>运行中的流程实例</li>
                        <div style="float: right; padding-bottom: 5px;"><a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="icon icon-refresh"></i></a></div>
                    </ol>
                </div>
                <!-- 点击查看流程图modal -->
                <div class="modal fade" id="ImgTraceModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                                <h4 class="modal-title">点击查看流程图</h4>
                            </div>
                            <div class="modal-body">
                                <img id="ImageTracePic" src="">
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 根据流程实例ID查看对应的流程变量数据modal -->
                <div class="modal fade" id="processVariablesModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                                <h4 class="modal-title">查看流程变量</h4>
                            </div>
                            <div class="modal-body">
                                <div id="processVariables"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <#--内容-->
                <div class="panel-body">
                    <div id="toolbar" class="toolbox btn-group" style="padding-top:10px; padding-bottom:10px;">
                        <div class="tools-group">
                        <#--<@shiro.hasPermission name="admin:role:add">-->
                            <button class="btn btn-danger" onclick="optDelete()"><i class="icon icon-times"></i>批量删除</button>
                        <#--</@shiro.hasPermission>-->
                        </div>
                    </div>
                    <table class="table table-hover">
                        <thead>
                        <tr>
                            <th><input type="checkbox" onclick="checkBox('ids',this.checked)"/></th>
                            <th>编号</th>
                            <th>实例ID</th>
                            <th>实例名称</th>
                            <th>流程定义ID</th>
                            <th>部署ID</th>
                            <th>activityID</th>
                            <th>当前节点</th>
                            <th>是否挂起</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                            <#if list??>
                                <#list list as runing>
                                    <tr>
                                        <th><input type="checkbox" class="checked_detect" value="${runing.id! }" name="ids"/></th>
                                        <th>${runing_index+1!}</th>
                                        <th>${runing.id!}</th>
                                        <th>${runing.name!}</th>
                                        <th>${runing.definitionId!}</th>
                                        <th>${runing.deploymentId!}</th>
                                        <th>${runing.activityId!}</th>
                                        <th>${runing.nodeName!}</th>
                                        <th>
                                            <#if runing.suspended == false>
                                                <button class="btn btn-info" onclick="hangActiveTraceNode('suspend','${runing.id! }')">挂起</button>
                                            <#elseif runing.suspended == true>
                                                <button class="btn btn-info" onclick="hangActiveTraceNode('active','${runing.id! }')">激活</button>
                                            </#if>
                                        </th>
                                        <th>
                                            <button class="btn btn-info" onclick="viewTraceNode('${runing.id! }')">查看流程图</button>
                                            <button class="btn btn-info" onclick="viewVariablesNode('${runing.id! }')">查看流程变量</button>
                                        </th>
                                    </tr>
                                </#list>
                            </#if>
                        </tbody>
                    </table>
                    <!-- 分页 start -->
                    <#--<#include "../../admin/common/page.ftl"/>-->
                    <!-- 分页 end -->
                </div>
            </div>
        </div>
    </div>
<#include "../common/footer.ftl"/>
</div>
<#--导入processInstanceList.js文件-->
<script src="/static/zui/js/workflow/processInstanceList.js"></script>
</body>
</html>